/*主导航*/
import React, { Component } from "react";
import { Menu } from 'antd';
import { Link } from 'react-router-dom';


import './style.less';

const { Item } = Menu;

const menuConfig = [
  {
    title: "首页",
    key: "/",
  },
  {
    title: "功能列表",
    key: "/main",
  },
];

class MainMenu extends Component {
  constructor(props) {
    super(props);
    this.state = {
      currentKey: ''  // 当前选中的目录
    };
  }

  render() {
    const { currentKey } = this.state;
    return (
      <Menu
        className="pinlor-main-menu"
        theme="dark"
        mode="horizontal"
        selectedKeys={[currentKey]}
      >
        {
          menuConfig.map(item => (
            <Item key={item.key} title={item.title} onClick={this.handleClick}>
              <Link to={item.key}>{item.title}</Link>
            </Item>
          ))
        }
      </Menu>
    )
  }

  componentDidMount() {
    /*const currentKey = this.props.key;
     this.setState({
     currentKey
     })*/
  }

  handleClick = ({ item, key }) => {
    this.setState(prev=>{
      console.log('接收key：'+key);
      return {
        currentKey: key
      }
    })
  };
}
export default MainMenu;
